<template>
  <div id="UserStatus">
    <el-dropdown>
      <span class="el-dropdown-link">
        <el-avatar
          size="large"
          :src="'http://localhost:4578/messy_json/img?path=' + userInfo.avatar"
        ></el-avatar>
      </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item @click="exit()">
          <div @click="exit()">
            <i class="el-icon-delete-solid"></i>
            退出登录
          </div>
        </el-dropdown-item>
        <!-- <el-dropdown-item>
          <i class="el-icon-upload"></i>
          修改密码</el-dropdown-item
        >
        <el-dropdown-item>
          <i class="el-icon-s-custom"></i>
          我的信息</el-dropdown-item
        > -->
      </el-dropdown-menu>
    </el-dropdown>
  </div>
</template>
<script>
export default {
  name: "UserStatus",
  data() {
    return {
      userInfo: "",
    };
  },
  methods: {
    exit() {
      this.$cookies.remove("gxsf_login");
      this.$cookies.remove("gxsf_key");
      window.location.reload();
    },
  },
  mounted() {
    this.userInfo = this.$cookies.get("gxsf_key");
  },
};
</script>
<style lang="less" scoped>
#UserStatus {
  position: fixed;
  right: 5%;
  top: 1%;
  z-index: 3;
}
</style>